<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<!DOCTYPE html>
		<html lang="zh-CN">
		<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>体检预约管理系统</title>
		<style>
		* {
		margin: 0;
		padding: 0;
		box-sizing: border-box;
		font-family: 'Microsoft YaHei', sans-serif;
		}
		
		body {
		background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
		height: 100vh;
		display: flex;
		justify-content: center;
		align-items: center;
		}
		
		.welcome-container {
		background-color: white;
		border-radius: 15px;
		box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
		width: 90%;
		max-width: 800px;
		padding: 40px;
		text-align: center;
		animation: fadeIn 1s ease-in-out;
		}
		
		.logo {
		width: 120px;
		height: 120px;
		margin: 0 auto 20px;
		background-color: #4a90e2;
		border-radius: 50%;
		display: flex;
		justify-content: center;
		align-items: center;
		color: white;
		font-size: 50px;
		font-weight: bold;
		}
		
		h1 {
		color: #333;
		margin-bottom: 20px;
		font-size: 28px;
		}
		
		p {
		color: #666;
		margin-bottom: 30px;
		line-height: 1.6;
		}
		
		.btn-group {
		display: flex;
		justify-content: center;
		gap: 20px;
		margin-top: 30px;
		}
		
		.btn {
		padding: 12px 30px;
		border-radius: 30px;
		font-size: 16px;
		font-weight: bold;
		cursor: pointer;
		transition: all 0.3s ease;
		border: none;
		}
		
		.btn-primary {
		background-color: #4a90e2;
		color: white;
		}
		
		.btn-primary:hover {
		background-color: #3a7bc8;
		transform: translateY(-3px);
		box-shadow: 0 5px 15px rgba(74, 144, 226, 0.4);
		}
		
		.btn-secondary {
		background-color: white;
		color: #4a90e2;
		border: 2px solid #4a90e2;
		}
		
		.btn-secondary:hover {
		background-color: #f0f7ff;
		transform: translateY(-3px);
		box-shadow: 0 5px 15px rgba(74, 144, 226, 0.2);
		}
		
		.features {
		display: flex;
		justify-content: space-around;
		margin: 40px 0;
		flex-wrap: wrap;
		}
		
		.feature {
		width: 30%;
		min-width: 200px;
		margin-bottom: 20px;
		}
		
		.feature-icon {
		font-size: 40px;
		color: #4a90e2;
		margin-bottom: 15px;
		}
		
		.feature-title {
		font-weight: bold;
		margin-bottom: 10px;
		color: #444;
		}
		
		.feature-desc {
		font-size: 14px;
		color: #777;
		}
		
		@keyframes fadeIn {
		from {
		opacity: 0;
		transform: translateY(20px);
		}
		to {
		opacity: 1;
		transform: translateY(0);
		}
		}
		
		@media (max-width: 768px) {
		.welcome-container {
		padding: 30px 20px;
		}
		
		.btn-group {
		flex-direction: column;
		gap: 10px;
		}
		
		.btn {
		width: 100%;
		}
		
		.features {
		flex-direction: column;
		align-items: center;
		}
		
		.feature {
		width: 80%;
		}
		}
		</style>
		</head>
		<body>
		<div class="welcome-container">
		<div class="logo">体</div>
		<h1>欢迎使用体检预约管理系统</h1>
		<p>为您提供便捷、高效的体检预约服务，一键预约，健康无忧</p >
		
		<div class="features">
		<div class="feature">
		<div class="feature-icon">📅</div>
		<div class="feature-title">在线预约</div>
		<div class="feature-desc">随时随地预约体检项目，灵活安排时间</div>
		</div>
		<div class="feature">
		<div class="feature-icon"></div>
		<div class="feature-title">机构选择</div>
		<div class="feature-desc">多家合作体检机构，满足不同需求</div>
		</div>
		<div class="feature">
		<div class="feature-icon"></div>
		<div class="feature-title">报告查询</div>
		<div class="feature-desc">电子报告随时查看，健康数据一目了然</div>
		</div>
		</div>
		
		<div class="btn-group">
		<button class="btn btn-primary" onclic
	</body>
</html>